<template>
	<view class="main">
		<view class="order-status">
			<view class="all-order" v-for="(item, index) in orderData" :key="index" @click="goOrderList(item)">
				<text v-if="userInfo.mobile" class="order-num">{{ item.num }}</text>
				<text v-else class="order-num">***</text>
				<text class="order-title">{{ item.name }}</text>
			</view>
		</view>
		<view class="content">
			<view class="perch"></view>
			<view
        @click="goDemand(item.url)"
        v-for="(item, index) in featureList"
        :key="index"
      >
        <view class="my_item" v-if="item.show">
          <view class="item_left">
            <image class="left_img" :src="item.icon" mode="scaleToFill" />
            {{ item.name }}
          </view>
          <view class="item_right">
            <view class="right_num" v-if="item.num >= 0">{{ item.num }}</view>
            <u-icon name="arrow-right" color="#ccc" size="18"></u-icon>
          </view>
        </view>
      </view>
		</view>


	</view>
</template>

<script>
import homeApi from '@/static/js/enterpriseServer/index.js'
export default {
	data() {
		return {
			orderData: [
				{
					id: '',
					name: '全部订单',
					num: null,
					index: 0
				},
				{
					id: 0,
					name: '待付款',
					num: null,
					index: 1
				},
				{
					id: 1,
					name: '服务中',
					num: null,
					index: 2
				},
				{
					id: 4,
					name: '已完成',
					num: null,
					index: 4
				}
			],
			userInfo: {},
			featureList: [
        {
          id: 0,
          name: "我的商品",
          icon: "/static/img/enterpriseServer/shop_icon.png",
          num: 0,
          url: "/enterpriseServer/myGoods/index",
          show: true,
        },
        {
          id: 1,
          name: "我的需求",
          icon: "/static/img/enterpriseServer/demand_my.png",
          num: 0,
          url: "/enterpriseServer/myDemand/index",
          show: true,
        },
        {
          id: 2,
          name: "我的代金券",
          icon: "/static/img/enterpriseServer/ticket_my.png",
          url: "/enterpriseServer/myTicket/index",
          show: true,
        },
        {
          id: 3,
          name: "我的收藏",
          icon: "https://xzcs-public-files.oss-cn-beijing.aliyuncs.com/static/New-my/icon-sc.png",
          url: "/enterpriseServer/myCollect/index",
          show: true,
        },
      ],
		}
	},
	onShow() {
		this.getOrderStatus()
	},
	onLoad(e) {
		this.userInfo = uni.getStorageSync("userInfo");
    if (this.userInfo.is_server == 1) {
      this.featureList[0].show = true;
    } else {
      this.featureList[0].show = false;
    }
	},
	methods: {
		//获取订单状态数据
		getOrderStatus() {
			homeApi.orderStatus().then(res => {
				if (res.code === 1) {
					this.orderData[0].num = res.data.shopordercount.allcount
					this.orderData[1].num = res.data.shopordercount.status0
					this.orderData[2].num = res.data.shopordercount.status1
					this.orderData[3].num = res.data.shopordercount.status3 + res.data.shopordercount.status4
					this.featureList[0].num = res.data.shop_count;
          this.featureList[1].num = res.data.demand_count;
				} else {
					this.$tools.msg(res.msg)
				}
			})
		},

		goOrderList(item) {
			uni.navigateTo({
				url: '/enterpriseServer/orderList/index?index=' + item.index
			})
		},

		goDemand(url) {
      uni.navigateTo({
        url: url,
      });
    },
	}
}
</script>

<style lang="scss" scoped>
page {
	height: 100%;
}

.main {
	display: flex;
	flex-direction: column;
	height: 100vh;
	width: 100%;
	overflow-y: auto;
	position: relative;
	background: #fff;

	.order-status {
		padding: 40rpx;
		display: flex;
		justify-content: space-between;
		background: #fff;

		.all-order {
			display: flex;
			flex-direction: column;
			align-items: center;

			.order-num {
				font-size: 38rpx;
				color: #333;
			}

			.order-title {
				margin-top: 8rpx;
				font-size: 28rpx;
				color: #666;
			}
		}
	}


	.content {
		background: #fff;

		.perch {
			height: 10rpx;
			background: #F3F7F8;
		}
	}

	.my_item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 36rpx 40rpx;

		.item_left {
			display: flex;
			align-content: center;
			font-size: 32rpx;
			color: rgba(0, 0, 0, 0.8);
			line-height: 40rpx;

			.left_img {
				width: 36rpx;
				height: 36rpx;
				margin-right: 40rpx;
			}
		}


		.item_right {
      display: flex;
      align-items: center;

      .right_num {
        margin-right: 10rpx;
        font-size: 32rpx;
        color: rgba(0, 0, 0, 0.5);
      }
    }
	}
}
</style>
